<template>
  <div class="pop-box">
    <div class="img-box">
      <img v-for="(img, index) in imageList" :key="index" v-du-lazy="img" @click="showImageView(index)" />
    </div>
  </div>
  <DuImageView ref="iviewRef" :images-data="imageList"></DuImageView>
</template>

<script setup>
import { useImagePreview } from '@/hooks/vant/useImagePreview'
const { iviewRef, showImageView } = useImagePreview()

defineProps({
  imageList: {
    type: Array,
    default: () => [],
  },
})
</script>

<style scoped lang="scss">
.pop-box {
  overflow-y: auto;
  overflow-x: hidden;
}
.img-box {
  padding: var(--app-padding);
  img {
    width: 100%;
    min-height: 400px;
    margin-bottom: var(--van-padding-md);
  }
}
</style>
